<?php $this->layout = "//layouts/column1"; ?>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="<?php echo Yii::app()->request->baseUrl; ?>/js/video.js" type="text/javascript"></script>	
<link href="<?php echo Yii::app()->request->baseUrl; ?>/css/video-js.css" rel="stylesheet" type="text/css">
<h1>View Video</h1>
<div style="background: #f9f9f9;padding: 3px 10px;border: 3px solid #eee;">
    <div class="form">
        <?php
        $form = $this->beginWidget('CActiveForm', array(
            'id' => 'video-form',
            'enableClientValidation' => false,
            'clientOptions' => array(
                'validateOnSubmit' => true,
            ),
                ));
        ?>

        <?php echo $form->errorSummary($model); ?> 

        <input id="mintime" type="hidden" value="<?php echo Yii::app()->params['minimum_time'] ?>" />
        <div id="dialog" title="Watch video" style="padding-top: 10px; display: none;" >
            <div style="text-align: left; padding-bottom: 5px;"><span>Time: </span> <span style="width: 100px;"  id="timecounter">00.00</span><span style="float: right" id="msg"></span></div>
            <video id="video_player" class="video-js vjs-default-skin" controls preload="none" width="500" height="250" 
                   data-setup="{}">
            </video>
        </div>
        <div class="grid-view">
            <table class="items" style="width: 100%; border-radius: 10px;">    
                <?php
                $resources = Resources::model()->findAll();
                foreach ($resources as $resource) {
                    if($resource->status == '1'){
                        $mth = MemberTransactionHistory::model()->findByAttributes(array('resources_id' => $resource->resources_id, 'member_id'=>Yii::app()->user->id));
                        if($mth == NULL){
                            $filepath = Yii::app()->request->baseUrl."/videos/".$resource->vedio;
                            ?>
                            <tr>
                                <td>
                                    <h4><?php echo $resource->vedio; ?></h4>

                                </td>
                                <td>
                                    <input type="hidden" value="<?php echo $filepath ?>" />
                                    <span id="<?php echo $resource->resources_id ?>" class="start" style="height: 30px; padding: 5px; border: 1px solid skyblue; cursor: pointer">Show</span>
                                </td>
                                <td>
                                    <h4>price: $ <?php echo $model->amount; ?></h4>
                                </td>
                            </tr>
                            <?php
                        }
                    }
                }
                ?>
            </table> 
        </div>	
        <script>
            $(function() {
                $( "#dialog" ).dialog({
                    autoOpen: false,
                    modal: true,
                    height: 330,
                    width: 527
                });
                
                // initilize video player
                var vidoplayer = _V_("video_player");
                var time = 0;
                var mintime = 0;
                var generationtransaction = false;
                var videoId = null;
                    
                $( ".start" ).click(function() {
                    // find vido source
                    //console.log($(this).parent().find("input[type=hidden]"));
                    //console.log($(this).parent().find("input[type=hidden]").attr("value"));
                    var currentvidofilepath = $(this).parent().find("input[type=hidden]").attr("value");
                    $("#video_player").load();
                    time = 0;
                    mintime = $("#mintime").attr("value");
                    //$("#timecounter").html("> min time: " + mintime);
                    generationtransaction = false;
                    videoId = $(this).attr("id");
                    //console.log(videoId);
                    
                    //var vidoplayer = _V_("video_player");
                    //console.log(vidoplayer);
                    vidoplayer.src({ type: "video/mp4", src: currentvidofilepath });
                    
                    // open modal dialog
                    $( "#dialog" ).dialog( "open" );
                });
                
                $(".ui-dialog-titlebar-close").click(function(){
                    vidoplayer.pause();
                    $( "#dialog" ).dialog( "close" );
                });
                
                var eventfunction = function(){
                    var player = this;
                    //console.log(player.currentTime());
                    //console.log(player.currentTime());
                    if(player.currentTime()>0){
                        //console.log(time++);    
                        time++;
                    }
                    
                    //time++;
                    $("#timecounter").html(player.currentTime());
                    if(time > mintime && generationtransaction == false){
                    //if(player.currentTime() > 60){
                    //    this.pause();
                    //    console.log('time to go server side');
                        generationtransaction = true;
                        $.ajax({
                            type: "POST",
                            url:    "<? echo Yii::app()->createUrl('memberPosition/generationTransaction'); ?>",
                            data:  {videoId:videoId},
                            success: function(msg){
                                console.log("Sucess")
                                $("#msg").html("Your job done!");
                            },
                            error: function(xhr){
                                console.log("failure"+xhr.readyState+this.url)
                            }
                        });
                    }
                }; 
                vidoplayer.on("timeupdate", eventfunction);
            });
        </script>
        <?php $this->endWidget();
        ?>
    </div>
</div>